<script lang="ts" setup>

    import { ref,reactive} from 'vue'
    import MyList from './MyList.vue';
    //插槽 slot 用于父组件向子组件传值（插入内容）
    //<1>.默认插槽（default）
    //注意:
    //1如果父组件用了template标签包裹一下再插入，一定不要忘了v-slot:name指令,默认的没名字（default可以省略)
    //2.如果插入的元素较多，建议template标签包裹一下再插入，这样不会影响父组件的样式
    //3.用template包裹，还有一个好处，可以结合其他指令使用
    let age=ref(18);

    //具名插槽
</script>

<template>
    <MyList>
        <template v-slot v-if="age < 20"><!-- :default -->
            <h1>天气预报</h1>
            <div>今天下雨了</div>
        </template>
    </MyList>
</template>

<style scoped>


</style>
